<template>
  <view class="huangj">
    <!-- <Heads></Heads> -->
    <Car :GoldProductNowData="GoldProductNowData"></Car>
    <view class="text">{{ GoldProductNowData.name }}</view>
    <view class="tu">
      <Tubiao
        :GoldProductLastWeekGoldDataListdays="
          GoldProductLastWeekGoldDataListdays
        "
        :GoldProductLastWeekGoldDataListgoldPrice="
          GoldProductLastWeekGoldDataListgoldPrice
        "
      ></Tubiao>
      <view class="fenlei">
        <view
          :class="item.code == true ? 'xuanzhong' : ''"
          :key="index"
          style="border-left: 0px"
          v-for="(item, index) in codetext"
          @click="change(item)"
          >{{ item.t }}</view
        >
      </view>
    </view>
    <view class="text">更多服务</view>
    <view class="fuwus">
      <Fuwu></Fuwu>
    </view>
    <view class="but" @click="bur(data)"> 立即购买 </view>
  </view>
</template>

<script>
import Heads from "../../components/huangjing/heads.vue";
import Car from "../../components/huangjing/car.vue";
import Tubiao from "../../components/huangjing/tubiao.vue";
import Fuwu from "../../components/huangjing/fuwu.vue";
import { createNamespacedHelpers } from "vuex";
const { mapState, mapMutations, mapActions } = createNamespacedHelpers(
  "huangjin"
);

export default {
  onLoad(o) {
    console.log(o, "000");
    // 动态表头
    wx.setNavigationBarTitle({
      title: o.name,
    });
    this.data = o;
    console.log(o);
    this.ids = o.id;
    this.getGoodNows();
    this.getGoldProductNowDatas({
      productId: this.ids,
    });
    this.getGoldProductLastWeekGoldDataLists({
      productId: this.ids,
    });
  },

  components: {
    Heads,
    Car,
    Tubiao,
    Fuwu,
  },
  data() {
    return {
      ids: "1",
      list: "分时",
      codetext: [
        {
          t: "近一周",
          code: true,
        },
        {
          t: "近一月",
          code: false,
        },
        {
          t: "近半年",
          code: false,
        },
        {
          t: "近一年",
          code: false,
        },
      ],
    };
  },
  computed: {
    ...mapState([
      "getGoodAll",
      "GoldProductNowData",
      "GoldProductLastWeekGoldDataListdays",
    ]),
  },
  methods: {
    ...mapActions([
      "getGoodDays",
      "getGoodYues",
      "getGoodBans",
      "getGoodNians",
      "getGoodNows",
      "getGoldProductNowDatas",
      "getGoldProductLastWeekGoldDataLists",
      "getGoldProductLastMonthGoldDataLists",
      "getGoldProductLastHalfYearGoldDataLists",
      "getGoldProductLastYearGoldDataList",
    ]),
    change(t) {
      this.codetext.map((item, index) => {
        item.code = false;
        if (t == item && item.t == "近一周") {
          this.getGoodDays();
          this.getGoldProductLastWeekGoldDataLists({
            productId: this.ids,
          });
          item.code = !item.code;
        } else if (t == item && item.t == "近一月") {
          //	this.getGoodYues()
          this.getGoldProductLastMonthGoldDataLists({
            productId: this.ids,
          });
          item.code = !item.code;
        } else if (t == item && item.t == "近半年") {
          //	this.getGoodBans()
          this.getGoldProductLastHalfYearGoldDataLists({ productId: this.ids });
          item.code = !item.code;
        } else if (t == item && item.t == "近一年") {
          //	this.getGoodNians()
          this.getGoldProductLastYearGoldDataList({ productId: this.ids });
          item.code = !item.code;
        }
        return item;
      });
    },
    bur(data) {
      console.log(data, "dddddddd");

      if (!uni.getStorageSync("token")) {
        uni.showModal({
          title: "提示",
          content: "请登录后购买",
          success: function (res) {
            if (res.confirm) {
              console.log("用户点击确定");
              uni.navigateTo({
                url: "/pages/login/login",
              });
            }
          },
        });
      } else if (
        uni.getStorageSync("userAssessmentLevel") == "未评测" &&
        uni.getStorageSync("token")
      ) {
        uni.showModal({
          title: "提示",
          content:
            "根据金融监管机构要求，在您投资前先完成风险测评问卷，进一步了解自身的投资风险及风险承受能力（预计[耗时80秒]）。在您购买产品时，我们将根据测评结果，进行风险等级匹配检查和风险提示，请您关注。",
          success: function (res) {
            if (res.confirm) {
              console.log("用户点击确定");
              uni.navigateTo({
                url: "/pages/appraisal/appraisal",
              });
            } else if (res.cancel) {
              console.log("用户点击取消");
            }
          },
        });
      } else  if (uni.getStorageSync("userAuthenticationStatus")=='未认证') {
        uni.showModal({
          title: "提示",
          content: "请进行身份认证后购买",
          success: function (res) {
            if (res.confirm) {
              console.log("用户点击确定");
              uni.navigateTo({
                url: "/pages/idDocument/idDocument",
              });
            }
          },
        });
      }else {
        uni.navigateTo({
          url:
            "/pages/buy/buy3/buy3?goldId=" +
            data.id +
            "&goldName=" +
            data.name +
            "&goldCode=" +
            data.fundCode,
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.but {
  margin-top: 24rpx;
  width: 90%;
  margin: 24px auto;
  height: 94rpx;
  border-radius: 16rpx;
  background-color: #ff4658;
  color: #ffffff;
  text-align: center;
  line-height: 94rpx;
  font-size: 36rpx;
}

.fuwus {
  padding: 20rpx;
}

.huangj {
  background-color: #fcfcfc;

  .text {
    width: 90%;
    margin: 0px auto;
    margin-top: 40rpx;
    font-size: 36rpx;
    font-weight: 500;
  }

  .tu {
    width: 90%;
    margin: 0px auto;
    background-color: #ffffff;
    border-radius: 20rpx;
  }

  .fenlei {
    height: 60rpx;
    width: 90%;
    margin: 20rpx auto;
    border: 1px solid #cdcdcd;
    border-radius: 20rpx;
    display: flex;

    view {
      width: 25%;
      text-align: center;
      line-height: 60rpx;
      border-right: 1px solid #cdcdcd;
    }
  }

  .xuanzhong {
    background-color: #ff4658;
    color: #ffffff;
    border-radius: 20rpx;
  }
}
</style>
